<template>
  <div class="main-container">
    <div class="title-content">
      <div class="title-item" v-for="item in projectInfo" :key="item.id">
        <!-- <span>{{item.icon}}</span> -->
        <div class="title-item-img">
          <img :src="item.icon" alt="图片加载失败" />
        </div>
        <span>{{ item.title }}</span>
      </div>
    </div>
    <div class="chart-content">
      <div class="chart-part-1">
        <div class="xmsl-content">
          <temp :options="mybarOption"></temp>
        </div>
        <div class="zsmj-content">
          <echart-pie></echart-pie>
        </div>
        <div class="zcfg-content">
          <ul>
            <li>
              <span
                ><img src="~@/assets/szzq_images/title_img_sign.png" alt=""
              /></span>
              <span>政策法规</span>
            </li>
            <li v-for="(item, index) in policyInfo" :key="index">
              <span>{{ index + 1 }}</span>
              <span>{{ item.title }}</span>
            </li>
          </ul>
        </div>
      </div>
      <div class="chart-part-2">
        <div class="zfje-content">
          <temp :options="myscatter"></temp>
        </div>
        <div class="azrk-content">
          <temp :options="myoption"></temp>
        </div>
        <div class="qypm-content">
          <ul>
            <li>
              <span
                ><img src="~@/assets/szzq_images/title_img_sign.png" alt=""
              /></span>
              <span>签约排名</span>
            </li>
            <li v-for="(item, index) in rankInfo" :key="index" class="rankitem">
              <span>{{ index + 1 }}</span>
              <span>{{ item.city }}</span>
              <div class="jdt">
                <el-progress
                  :percentage="item.percentage"
                  :color="item.customColor"
                ></el-progress>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style>
</style>